<template>
  <a-card :bordered="false">
    <div class="container">
<!--      <div class="top">-->
<!--        <div class="wid">-->
<!--          <h2>{{this.postingtitle}}</h2>-->
<!--          -->
<!--        </div>-->
<!--      </div>-->
      <div class="needs">
        <div class="wid" style="padding-right: 10px">
          <div class="wrap">
            <div class="page-tit">
              <span class="fl">{{this.postingtitle}}</span>
              <div class="fr"><i>*</i><span>为必填项</span></div>
            </div>
            <div class="item">
              <div class="title" style="font-weight: bolder">基础信息</div>

            <ul>
              <li>
                <p><span><i>*</i>客户名称</span></p>
                <a-input class="
                input"  placeholder="请输入客户名称" v-model="companyName">
                </a-input>
              </li>

              <li>
                <p><span><i>*</i>联系人</span></p>
                <a-input class="input" placeholder="请输入联系人" v-model="realName"></a-input>
              </li>

              <li>
                <p><span><i>*</i>联系电话</span></p>
                <a-input class="input"
                 placeholder="请填写联系电话" disabled=true  v-model="phone"></a-input>
              </li>

              <li>
                <p><span><i>*</i>地址</span></p>
                <a-input class="input"  placeholder="请输入地址" v-model="address"></a-input>
              </li>
              <!-- <li>
                <p><span><i>*</i>品牌</span></p>
                <a-input class="input"  placeholder="请输入品牌" v-model="brandLabels"></a-input>
              </li> -->
               <li v-if="businessLicense!=''">
                     <p><span>当前营业执照</span></p>
                     <img :src="businessLicense"  style="width:100px;height:100px;"/>
               </li>
              <li>
                <p><span>营业执照</span></p>
                <a-form-item label="" :labelCol="labelCol" :wrapperCol="wrapperCol">
                  <j-image-upload class="avatar-uploader" text="上传" v-model="businessLicense" style="margin-top: 8px;"></j-image-upload>
        <!--          <el-upload
  style="margin-top: 20px;"
  action="http://clound_clothing.wenkangkeji.com/mlcc/user/interface/uploadImage"
  list-type="picture-card"
  :limit="1"
  :on-exceed="handleExceed"
  :on-preview="handlePictureCardPreview"
  :on-remove="handleRemove"
  :on-success="handleSuccess"
  ref="upload">
  <i class="el-icon-plus"></i>
</el-upload> -->
                </a-form-item>
              </li>
            </ul>
          </div>

                <div class="item" style="margin-top: 20px">
                     <div class="title" style="margin-bottom: 20px;font-weight: bold">结算方式</div>

                      <p><span><i style="color:red;">*</i>结算方式</span></p>

                     <a-radio-group v-model="isMonth" style="margin-top: 5px">
                            <a-radio :style="radioStyle" :value="0">
                             普通用户
                         </a-radio>
                          <a-radio :style="radioStyle" :value="1">
                           月结用户
                             </a-radio>

                 </a-radio-group> <br/><br/>

                  <div style="float: left">
                    <p v-if="isMonth==1"><span><i style="color:red;"></i>月结额度</span></p>
                    <a-input v-if="isMonth==1" style="margin-top: 7px;width: 200px;"  placeholder="请设置月结额度" v-model="monthLines"></a-input>
                  </div>

                  <div style="float: left;margin-left: 12px">
                    <p v-if="isMonth==1"><span><i style="color:red;"></i>剩余额度</span></p>
                    <a-input v-if="isMonth==1" style="margin-top: 7px;width: 200px;" disabled=true  v-model="remainingLimit"></a-input>
                  </div>
            </div>


          <div class="item" style="margin-top: 30px">
            <div class="title" style="margin-bottom: 20px;font-weight: bold">登录账号</div>
            <div style="width: 100%;overflow: hidden;">
              <div class="box_ss1" style="width: 300px;float: left;margin-right: 40px">

              </div>
              <div class="box_ss2" style="width: 640px;float: left;">

                <div style="width: 100%;overflow:hidden;height: 90px">
                  <div style="float: left;width: 300px;">
                    <p><span><i style="color:red;">*</i>登录账号</span></p>
                    <a-input style="margin-top: 7px;"  placeholder="请填写你的登录账号" disabled=true  v-model="userName"></a-input>
                  </div>
               <!--   <div style="float: left;width: 300px;margin-left: 40px">
                    <p><span><i style="color:red;">*</i>登录密码</span></p>
                    <a-input type="password" style="margin-top: 7px;"  placeholder="请填写你的登录密码" v-model="passWord"></a-input>
                  </div> -->
                </div>

              </div>
            </div>
          </div>

          <div class="item" style="margin-top: 18px">
    <div class="title" style="margin-bottom: 10px;font-weight: bold">备注</div>
			      <!-- <a-input  placeholder="请填写你的备注" v-model="remark"></a-input> -->
						 <a-textarea placeholder="请填写你的备注" :rows="4"  v-model="remark" style="width: 300px;"/>
          </div>

          <div class="submit">
            <button class="c1" @click="addCustomer()">保存提交</button>

          </div>
        </div>
      </div>
    </div>
    </div>
    <!--    <LgyxPostingRequirements-modal ref="modalForm" @ok="modalFormOk"></LgyxPostingRequirements-modal>-->
  </a-card>
</template>

<script>
  import '@/assets/less/TableExpand.less'
  import {
    mixinDevice
  } from '@/utils/mixin'
  import {
    JeecgListMixin
  } from '@/mixins/JeecgListMixin'
  import '@/assets/less/TableExpand.less'
  import JAreaLinkage from '@comp/jeecg/JAreaLinkage'
  import JDate from '@/components/jeecg/JDate.vue'
  import {
    deleteAction,
    getAction,
    putAction,
    postAction,
    downFile,
    getFileAccessHttpUrl
  } from '@/api/manage'
  // 引入搜索部门弹出框的组件
  // import JImageUpload from '../../../components/jeecg/JImageUpload'
  import JImageUpload from '../../components/jeecg/JImageUpload'

  export default {
    name: "updateCustomer",
    mixins: [mixinDevice, JeecgListMixin],
    components: {
      JDate,
      JAreaLinkage,
      JImageUpload
    },
    data() {
      let self = this
      return {
		  remainingLimit:'',
				remark:'',
        businessLicense:'', //营业执照
      companyName:'',
     realName:'',
     phone:'',
     address:'',
     brandLabels:'',
     monthLines:'',
     userName:'',
     passWord:'',
     isMonth:'0',
        resultCheck: '', //检查公司名称的结果
        isshenhe:'',//需求是否需要审核
        flag:false, //数据验证的最终结果


        url: {
          list: "/total/sys_user/query_totalSysuser_Detail",
           detail:"/BackCust/getBackCustDetail",
          add:"/BackCust/addBackCustomer",
          update:"/BackCust/updateuser"
        },
        dialogVisible: false,
        dictOptions: {},
        pcaData: '',


        searchOption: {
          city: '',
          citylimit: ''
        },
        events: {
          pName: 'Geolocation',
          init: (o) => {
            console.log('o', o)
            console.log('center', o.getCenter())
            o.getCity(result => {
              console.log(result)
            })
          },
          click: (e) => {
            console.log(e)
            let {
              lat,
              lng
            } = e.lnglat
            let pos = [lng, lat].join(',')
            console.log('pos', pos)
            self.curMarker = [lng, lat]
            self.setAssres(self.curMarker)
          }
        },
        plugin: [{
          pName: 'ToolBar', //工具条插件
          position: 'LB',
        },
          {
            pName: 'OverView',
            //isOpen:true//鹰眼是否打开
          },
          {
            pName: 'Scale'
          },
          {
            pName: 'Geolocation', //定位插件
            events: {
              init(o) {
                //定位成功 自动将marker和circle移到定位点
                o.getCurrentPosition((status, result) => {
                  let {
                    lat,
                    lng
                  } = result.position
                  self.curMarker = [lng, lat]
                  self.setAssres(self.curMarker)
                  self.$nextTick();
                });
              }
            }
          }
        ]
      }
    },
    created() {
      if(this.$route.query.id==0){
        console.log("这个是新增方法");
      }else{
        console.log("这个是编辑方法");
          let id=this.$route.query.id;

       getAction(this.url.detail,{"userId":id}).then((res)=>{
              if(res.success){
                this.companyName=res.result.companyName;
               this.realName=res.result.realName;
                this.phone=res.result.phone;
                   this.userName=res.result.userName;
                   this.address=res.result.address;
                   this.brandLabels=res.result.brandLabels;
                   this.monthLines=res.result.monthLines;
                   this.isMonth=res.result.isMonth;
                    this.businessLicense=res.result.businessLicense;
					this.remark=res.result.remark;
					this.remainingLimit=res.result.remainingLimit;

					//this.passWord=res.result.passWord;
              }else{
                this.$message.warning(res.message);
              }
            })
      }

    },
    computed: {
      uploadAction: function() {
        return this.url.fileUpload;
      }
    },
    methods: {
       //上传图片成功函数
      handleSuccess(response, file, fileList) {
        var result = response;
        this.businessLicense = result.data;
      },
     addCustomer(){

       let formData={
              "id":this.$route.query.id,
             "realName":this.realName,
             "phone":this.phone,
             "address":this.address,
             "brandLabels":this.brandLabels,
             "monthLines":this.monthLines,
             "userName":this.userName,
             "passWord":this.passWord,
              "isMonth":this.isMonth,
              "companyName":this.companyName,
              "businessLicense":this.businessLicense,
			   "remark":this.remark
       };

             let url;
            if(this.$route.query.id==0){
              url=this.url.add;
            }else{
                 url=this.url.update;
            }
           postAction(url,formData).then((res)=>{
              if(res.success){
                this.$message.success(res.message);
                this.$router.push({path:'/Customer/management'})
              }else{
                this.$message.warning(res.message);
              }
            }).finally(() => {
              this.confirmLoading = false;
              this.close();
            })
     },



      initDictConfig() {

      },


    },
  }
</script>
<style scoped>
  @import '~@assets/less/common.less';
  @import '~@assets/less/style.min.css';
  @import '~@assets/less/addzhaopin.css';
  @import '~@assets/less/newstyle.css';
</style>
